import { Component } from '@angular/core';
import { catchError, forkJoin, mergeMap, of, throwError } from 'rxjs';
import { badRequest, request } from 'src/app/request';

@Component({
  selector: 'app-demo',
  templateUrl: './demo.component.html',
  styleUrls: ['./demo.component.scss'],
})
export class DemoComponent {
  ngOnInit() {
    // request('test.com').subscribe({
    //   next: (res) => console.log('成功: ', res),
    //   error: (err) => console.log('失败: ', err),
    //   complete: () => console.log('完成'),
    // });

    // badRequest('test2.com').subscribe({
    //   next: (res) => console.log('成功: ', res),
    //   error: (err) => console.log('失败: ', err),
    //   complete: () => console.log('完成'),
    // });

    // request('test.com')
    //   .pipe(
    //     catchError((err) => {
    //       console.log('接口错误');
    //       return of(err);
    //     })
    //   )
    //   .subscribe((res) => console.log(res));

    // badRequest('test2.com')
    //   .pipe(
    //     catchError((err) => {
    //       console.log('接口错误');
    //       return of(err);
    //     })
    //   )
    //   .subscribe((res) => console.log(res));

    // request('foo')
    //   .pipe(
    //     mergeMap((res) => {
    //       console.log('res1: ', res);
    //       return request('bar');
    //     }),
    //     mergeMap((res) => {
    //       console.log('res2: ', res);
    //       return request('bazz');
    //     })
    //   )
    //   .subscribe((res) => console.log('res3: ', res));

    // 串行请求
    // const pipeErrorHandler = function (message: string) {
    //   return catchError((err) => {
    //     if (err && err.bad) {
    //       // 前面已有错误，且已被处理，直接return
    //       return throwError(() => err);
    //     }
    //     console.log(message);
    //     console.log('err: ', err);
    //     // 处理error
    //     // ...
    //     return throwError(() => ({ bad: true }));
    //   });
    // };

    // request('foo')
    //   .pipe(
    //     pipeErrorHandler('foo 请求失败'),
    //     mergeMap((res) => {
    //       console.log('res1: ', res);
    //       return request('bar');
    //     }),
    //     pipeErrorHandler('bar 请求失败'),
    //     mergeMap((res) => {
    //       console.log('res2: ', res);
    //       return badRequest('bazz');
    //     }),
    //     pipeErrorHandler('bazz 请求失败')
    //   )
    //   .subscribe({
    //     next: (res) => console.log('res3: ', res),
    //     error: (err) => {
    //       console.log('串行请求任务失败');
    //     },
    //   });

    // 并行请求
    // forkJoin({
    //   request1: request('foo'),
    //   request2: request('bar'),
    //   request3: request('bazz'),
    // }).subscribe({
    //   next: (value) => console.log(value),
    //   complete: () => console.log('complete'),
    // });

    forkJoin({
      request1: request('foo'),
      request2: request('bar'),
      request3: badRequest('bazz'),
    }).subscribe({
      next: (value) => console.log(value),
      error: (err) => console.log('有错误:', err),
      complete: () => console.log('complete'),
    });
  }
}
